.lang-dropdown
  display: flex
  align-items: center
  cursor: pointer
  height: 35px
  margin-right: 15px
  padding: 0 15px
  color: $ButtonText
  font-family: $MainFont
  font-smoothing: antialiased
  text-align: center
  font-size: 12px
  line-height: 34px
  transition: background-color 0.5s

  .lang-name
    margin-right: auto

.open .lang-dropdown
  background: $ButtonBg
  border-radius: $ButtonRadius
  background-clip: padding-box

.flag-container
  display: flex
  flex-wrap: wrap
  max-width: 100%

.flag
  margin: 3px
  background-image: url("../images/flags/none.png")
  background-size: 24px 24px
  background-position: center
  cursor: pointer
  width: 24px
  height: 22px
  &.NA
    background-image: url("../images/flags/none.png")
  &.toggle
      top: -6px
      border-radius: 0
      background-color: transparent
  &.ar
      background-image: url("../images/flags/arabic.png")
  &.hy
      background-image: url("../images/flags/armenian.png")
  &.eu
      background-image: url("../images/flags/basque.png")
  &.bn
      background-image: url("../images/flags/bengali.png")
  &.bs
      background-image: url("../images/flags/bosnian.png")
  &.pt-br
      background-image: url("../images/flags/brazilian.png")
  &.bg
      background-image: url("../images/flags/bulgarian.png")
  &.zh
      background-image: url("../images/flags/chinese.png")
  &.hr
      background-image: url("../images/flags/croatian.png")
  &.cs
      background-image: url("../images/flags/czech.png")
  &.da
      background-image: url("../images/flags/danish.png")
  &.nl
      background-image: url("../images/flags/dutch.png")
  &.en
      background-image: url("../images/flags/english.png")
  &.et
      background-image: url("../images/flags/estonian.png")
  &.fa
      background-image: url("../images/flags/farsi.png")
  &.fi
      background-image: url("../images/flags/finnish.png")
  &.fr
      background-image: url("../images/flags/french.png")
  &.de
      background-image: url("../images/flags/german.png")
  &.el
      background-image: url("../images/flags/greek.png")
  &.he
      background-image: url("../images/flags/hebrew.png")
  &.hu
      background-image: url("../images/flags/hungarian.png")
  &.it
      background-image: url("../images/flags/italian.png")
  &.id
      background-image: url("../images/flags/indonesian.png")
  &.lv
      background-image: url("../images/flags/latvian.png")
  &.lt
      background-image: url("../images/flags/lithuanian.png")
  &.mt
      background-image: url("../images/flags/maltese.png")
  &.no
      background-image: url("../images/flags/norwegian.png")
  &.pl
      background-image: url("../images/flags/polish.png")
  &.pt
      background-image: url("../images/flags/portuguese.png")
  &.ro
      background-image: url("../images/flags/romanian.png")
  &.ru
      background-image: url("../images/flags/russian.png")
  &.sr
      background-image: url("../images/flags/serbian.png")
  &.sk
      background-image: url("../images/flags/slovak.png")
  &.sl
      background-image: url("../images/flags/slovenian.png")
  &.es
      background-image: url("../images/flags/spanish.png")
  &.sv
      background-image: url("../images/flags/swedish.png")
  &.th
      background-image: url("../images/flags/thai.png")
  &.tr
      background-image: url("../images/flags/turkish.png")
  &.uk
      background-image: url("../images/flags/ukrainian.png")
  &.vi
      background-image: url("../images/flags/vietnamese.png")


